react native环境配置
参考链接：https://reactnative.cn/docs/next/getting-started.html1，安装node环境，比较简单略2，安装python2：参考文章3，使用npm安装yarn: 但是输入yarn 报错，命令不存在后经查询知，之前的node版本的8.x太低了，所以在node官网下载了最新版10.x再次操作命令行成功，可以正常运行yarn和react-native命令了；4，安装ja...
2024-01-10
react native 获取地理位置
此版本是0.47react native 官网介绍了这个 api Geolocation 但是这个api只能返回 经纬度 所以要把经纬度 通过逆地理位置转义 http://recode.ditu.aliyun.com/jsdoc/geocode_api.html 可通过这个阿里的开放接口RN 0.55以下版本需要导入 不包括0.55import Geolocation from 'Geolocation';0.55 以及0.55以上 Android 上获取可能存在问题 官网介...
2024-01-10
react native 学习笔记13
1.今天学习定义页面，效果如下：定义的页面最上面一个没有顶上去，还需要修改页面修改searchbar：marginTop：Platfrom.OS==='ios'?20:0 说明：Ios上边为20，而android=0；2.建搜索框3.学习滚动页面上面的广告3个页面，小而且，不好看，一般用户就看一个大的广告，所以还需要修改界面需要让广告动起来...
2024-01-10
react native 学习资料整理
入门教程深入浅出 React Native：使用 JavaScript 构建原生应用 http://www.appcoda.com/react-native-introduction/ 中文版 http://www.cocoachina.com/ios/20150408/11513.html react 做的一款打分app 入门教程http://www.oschina.net/translate/going-native-with-reactreact-native 之布局篇 https://...
2024-01-10
react-native 中样式的骚写法
今天在读人家源码时发现了一个rn样式的骚写法：import { StyleSheet, Platform,} from 'react-native';const styles = StyleSheet.create({ container: { flex: 1, justifyContent: 'center', alignItems: 'center', backgroundColor: '#eee', ...Platform.select({ ios: { ...
2024-01-10
一个标准的 react-native 组件
前言：react-native开发的app，虽然说是兼容 android 和 ios 两端；但其框架本身的设计思想有很多还是和前端类似的（毕竟是 react 的衍生产物）；其开发模式主要还是组件化！今天，来总结一下，一个 react-native 标准的组件包括哪些元素：标准的组件完整代码：import React, {Component} from "react";import { Style...
2024-01-10
react native 之 获取键盘高度
多说不如多撸:/** * Created by shaotingzhou on 2017/2/23. *//** * Sample React Native App * https://github.com/facebook/react-native * @flow */import React, { Component } from 'react';import { AppRegistry, StyleSheet, Text, View, Keyboard, TextI...
2024-01-10
react native 混合开发代码示例
ReactNativeModuleProjectreact native project for hybrrd app，自己做的一个混合开发研究，个人觉得相对于其他混合开发框架来说，有很大优势，不用学习复杂的js语法， 并且对更接近原生，能够保证运行更加流畅和风格统一，同时它的语法和控件也更加容易理解，上手较快。也可以和原生应用混合开发，互相调...
2024-01-10
react-native 打开设置界面
iOSiOS打开设置还是比较简单的，使用Linking组件即可：Linking.openURL('app-settings:') .catch(err => console.log('error', err))Android1、在android/app/src/main/java/com/<projectname>/文件夹下创建opensettings文件夹2、在这个文件夹下创建模块文件OpenSettingsModule.java（模块功能）和包文件OpenSettingsPackage.java（注册...
2024-01-10
react-native 列式布局 行式布局
/** * Create by bamboo on 2018-04-13 * 页面布局 */import React, { Component } from 'react';import { StyleSheet, Text, View,} from 'react-native';export de...
2024-01-10
React Starter Kit 中文文档
最近没事又翻译了个玩意。Github上的一个Star 非常高的 React 样板程序。由Node.js，Express，GraphQL和React构建，可选加入Redux等，并可以包含Webpack，Babel和Browsersync。项目主页：React Starter KitGithub项目地址：https://github.com/kriasoft/react-starter-kit中文文档地址：http://rsk.book.jasperxu.com/中文文档项目地址：https://...
2024-01-10
前端开发-react-native 项目
快速搭建rn项目步骤：1.命令行指令：npm i react-native-cli -g2.react-native init aaa3.Android Studio 导入创建的aaa项目下的Android文件夹，在安卓模拟机里运行（Android Studio 安装参照官网） 步骤详解 1.安装react native cli 2.react-native init aa(项目名) 3.aa项目下的Android文件夹导入Android Studio 4.运行项目 5.创建模拟机...
2024-01-10
使用react native制作的微博客户端
简要说明: 因为微博授权权限设置,本人的微博开放者账号权限太低,如果出现 'api请求次数受限,请更换. 10023' 弹框 或者 授权界面出错,需要自行更换开放者应用的appkey,授权回调页,App Secret. 修改位置在 App/Home/login.js新浪开放者平台因为项目较为简单,所以不使用redux或者mbox.其实,因为我不太会,这么说吧....
2024-01-10
React-native项目构建中的坑
2019独角兽企业重金招聘Python工程师标准>>> 从12月24日开始搭建React-native项目，期间构建项目 一直报错，Build failed with an execption，顺便帮贴一下收益良多的帖子 ，有需要的同学可以查看。好了 进入重点----------------------来一条华丽的分割线-------------------------------当项目一切都OK 进入到 react-native run-a...
2024-01-10
React native修改state中的数组
今天遇到在react native中修改state中子项为数组的情况，一直赋值不成功，后来查资料发现native中数组是引用，不能直接对引用赋值，查找资料的时候找到了该网页：修改数组项的时候要返回一个新数组，可以用扩展运算符...加上新的项！后来完美解决！感谢网友的强大力量补充：删除state中的数...
2024-01-10
react-native项目移到mac上
Windows上开发的Android项目，准备搞IOS版本，需要移植到mac上，记录一下错误，1、编译不过chmod 755 /Users/xiongge/my-app/demo/node_modules/react-native/packager/launchPackager.command2、编译不过chmod 755 /Users/xiongge/my-app/demo/node_modules/react-native/packager/react-native-xcode.sh3、运行报错chmo...
2024-01-10
react-native使用谷歌浏览器调试
学习交流：https://gitee.com/potato512/Learn_ReactNativereact-native学习交流QQ群：806870562通过 谷歌浏览器Chrome调试React Native程序步骤一：先在模拟器上运行项目步骤二：选中模拟器，同时使用键盘上的组合键"Command + D"打开Developer Menu菜单，并单击选择”Debug JS Remotely"步骤三：在打开的谷歌浏览器里选择开发者...
2024-01-10
react实战 : react 与 svg
有一个需求是这样的。一个组件里若干个区块。区块数量不定。区块里面是一个波浪效果组件，而这个一般用 SVG 做。所以就变成了在 react 中使用 SVG 的问题。首先是波浪效果需要的样式。.p{ font-size: 12px; line-height: 2; text-align: center; margin:0; width: 52px; color: #fff;}.irrigate_svg { height: 52px; widt...
2024-01-10
React中使用Ant Table组件
一、Ant Design of React http://ant.design/docs/react/introduce二、建立webpack工程 webpack+react demo下载 项目的启动，参考三、简单配置 1.工程下载下来之后，在src目录下新建目录“table”，新建app.js，内容如下。import React from 'react';import ReactDOM from 'react-dom';import ExampleTable from './Example...
2024-01-10如何在react-native中缩小WebView？
我在react-native中使用“ WebView”来呈现网页。该网页没有适合移动设备的用户界面。当我在Chrome浏览器中打开它时，如下图所示。 但是，当我渲染下面的代码时，它看起来像下面的图像。请参阅我已经尝试了不同的道具automaticallyAdjustContentInsets ={false}，scalesPageToFit={false}。但这并没有给我欲望输出。ren...
2024-01-10
图解React SSR中的hydrate
React CSR：水车模型当初在理解 React CSR 时做过一个比喻，把单向数据流比作瀑布模型：瀑布模型：由props（水管）和state（水源）把组件组织起来，组件间数据流向类似于瀑布。数据流向总是从祖先到子孙（从根到叶子），不会逆流（摘自深入 React）单组件的微观视角下，我们把props理解为水管（数...
2024-01-10
react-native 学习之TextInput组件篇
1 /** 2 * Sample React Native App 3 * https://github.com/facebook/react-native 4 */ 5 'use strict'; 6 import React, { 7 AppRegistry, 8 Component, 9 StyleSheet, 10 Text, 11 View, 12 Image, 13 TextInput 14 } from 'react-native'; 15...
2024-01-10
react中tab选项卡切换
直接上代码 不用的组件可以删了import React from 'react';import { NavLink} from "react-router-dom";import Otherbanner from '../otherbanner/index.js';import Header from '../../header/index.js';import Footer from '../../footer/index.js';class Index extends React.Componen...
2024-01-10
react.js - react中路由参数的获取时机
路由参数是作为props传入组件的，它像普通属性一样，在路由组件创建或重新渲染时传入组件。至于那个周期获取，看实际情况。要用作异步请求可在componentDidmount获取，要渲染出来可在render中获取，要在渲染前做检测可在render之前的生命周期里获取。...
2024-01-10
vue&Angular&React的优缺点 - H海涛
一、Vue.js： 其实Vue.js不是一个框架，因为它只聚焦视图层，是一个构建数据驱动的Web界面的库。 Vue.js通过简单的API（应用程序编程接口）提供高效的数据绑定和灵活的组件系统。 Vue.js的特性如下： 1.轻量级的框架 2.双向数据绑定 3.指令 4.插件化 ...
2024-01-10
